<template>
	<div class="container">
		<!-- <home-common-search :value="params.keyword" type="good"></home-common-search> -->
		<div class="common-header-wrap">
			<mt-header class="common-header" title="热门推荐"><mt-button icon="back" slot="left" @click="goBack"></mt-button></mt-header>
		</div>
		<goodslist-main v-if="!nav"></goodslist-main>
		<common-store-list v-if="nav" />

		<!--        <div v-if="nav" class="store-main">-->
		<!--            <div class="storm-list">-->
		<!--                -->
		<!--            </div>-->
		<!--        </div>-->
	</div>
</template>

<script>
import HomeCommonSearch from '../common/HomeCommonSearch'
import GoodslistMain from './GoodslistMain'
import CommonStoreList from '../common/CommonStoreList'

export default {
  name: 'HomeGoodslist',
  components: {
    HomeCommonSearch,
    GoodslistMain,
    CommonStoreList
  },

  data () {
    return {
      params: {
        keyword: this.$route.query.keywords ? this.$route.query.keywords : ''
      },
      nav: 0 // 当前选中目录值 0:目录 1:简介
    }
  },

  created () {},
  methods: {
    goBack () {
      this.$router.go(-1)
    }
  }
}
</script>

<style scoped lang="scss">
.goodlist-nav {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	width: 50vw;
	margin: auto;
	margin-bottom: 0.5rem;
	div {
		padding: 8px 0;
		font-size: 0.7rem;
		font-weight: bold;
	}
	.active {
		color: #3c7c45;
		border-bottom: 3px solid #3c7c45;
	}
}
</style>
